<template>
  <div v-if="wii">
    <div v-if="isApp">
      <div class="app_qrcode_signIn_layout_box">
        <Loading :loading="loading">
          <div v-if="!signinIsFailed">
            <img
              class="app_qrcode_signIn_computer_icon"
              src="https://manager-1254950508.cosgz.myqcloud.com/202404071622477f09b9b70-78a8-11ea-9280-1353816e73c3.png"
            />
            <div class="app_qrcode_signIn_notice">
              <div>即将在电脑上登陆</div>
              <div style="padding-top: 10px;">请确定是否是本人操作</div>
            </div>
            <div>
              <Button type="primary" long size="large" @click="handleOk">确认登陆</Button>
              <Button size="large" long style="margin-top: 20px;" @click="handleCancel">取消</Button>
            </div>
          </div>
        </Loading>
      </div>
      <Alert type="error" show-icon v-if="signinIsFailed">
        登陆失败
        <span slot="desc">{{signinFailedMessage}}</span>
      </Alert>
    </div>
    <div v-else>
      <Alert type="error" show-icon>
        登陆失败
        <span slot="desc">请使用平台app打开</span>
      </Alert>
    </div>
  </div>
</template>

<script>
import { Alert, Button } from "view-design";
import config from "@/utils/config";
import request from "@/utils/request";
import Loading from "@/components/Loading";
export default {
  components: {
    Alert,
    Button,
    Loading
  },
  data: function() {
    return {
      signinIsFailed: false,
      loading: false,
      /** 登陆失败错误信息 */
      signinFailedMessage: null,
      showModal: true,
      isApp: navigator.userAgent.indexOf("yyn") !== -1,
      wii: null
    };
  },
  beforeMount() {
    let script = document.createElement("script");
    script.type = "text/javascript";
    script.src = `https://yyn.ybsjyyn.com/app/static/h5common/static/lib/js-bridge_55cc666.js`;
    let vm = this;
    document.body.appendChild(script);
    script.onload = function() {
      vm.wii = wii;
    };
  },
  mounted() {
    this.sacnSuccess();
  },
  methods: {
    /** 扫码成功 */
    async sacnSuccess() {
      if (!this.isApp) {
        return;
      }
      let query = this.$route.query;
      let response = await request.putRequest(
        `${config.serverProxy}${config.authServicePath}/auth/signIn/qrCodeScanSuccess`,
        query
      );
      if (
        response.data.errorCode === 20002 ||
        response.data.errorCode === 401 ||
        response.data.errorCode === 403
      ) {
        this.wii.app.invoke("login");
      } else if (response.data.errorCode !== 0) {
        this.signinIsFailed = true;
        this.signinFailedMessage = response.data.msg;
      }
    },
    handleCancel() {
      this.wii.app.invoke("closeWindow");
    },
    async handleOk() {
      this.loading = true;
      let query = this.$route.query;
      let response = await request.postRequest(
        `${config.serverProxy}${config.authServicePath}/auth/signIn/qrCodeSignIn`,
        query
      );
      this.loading = false;
      if (
        response.data.errorCode === 20002 ||
        response.data.errorCode === 401 ||
        response.data.errorCode === 403
      ) {
        this.wii.app.invoke("login");
      } else if (response.data.errorCode === 0) {
        console.log("关闭当前窗口before");
        this.wii.app.invoke("closeWindow");
        console.log("关闭当前窗口after");
      } else {
        this.signinIsFailed = true;
        this.signinFailedMessage = response.data.msg;
      }
    }
  }
};
</script>

<style lang="less" scoped>
.app_qrcode_signIn_layout_box {
  text-align: center;
  display: flex;
  justify-content: center;
  .app_qrcode_signIn_computer_icon {
    width: 300px;
  }
  .app_qrcode_signIn_notice {
    padding: 20px;
    font-size: 15px;
  }
}
</style>
